<template>
	<view>
		<input class="search" value="" type="text" placeholder="请输入关键字" placeholder-style="" placeholder-class="input-placeholder" maxlength="140" focus="false" bindinput="" bindfocus="" bindblur="" bindconfirm=""></input>
		<view class="msglist">
		  <view class="item row" @click="jump()" data-url="/pages/sysmsg/sysmsg">
		    <image class="head" src="/static/images/icon/systent.png" />
		    <view class="flex">
		      <view class="row">
		        <view class="title">系统消息</view>
		        <view class="time">18:46</view>
		      </view>
		      <view class="row">
		        <view class="info">系统消息系统消息</view>
		        <view class="num">1</view>
		      </view>
		    </view>
		  </view>
		  <view class="item row" @click="jump()" data-url="/pages/interview/interview">
		    <image class="head" src="/static/images/icon/interview.png" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload="" />
		    <view class="flex">
		      <view class="row">
		        <view class="title">面试邀请</view>
		        <view class="time">18:46</view>
		      </view>
		      <view class="row">
		        <view class="info">收到“西安顾家装饰”的面试邀请函</view>
		        <view class="num">12</view>
		      </view>
		    </view>
		  </view>
		  <view class="item row"  @click="jump()" data-url="/pages/interview/detial">
		    <image class="head" src="/static/images/lib/avator.png" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload="" />
		    <view class="flex">
		      <view class="row">
		        <view class="title">冯敏</view>
		        <view class="time">18:46</view>
		      </view>
		      <view class="row">
		        <view class="info">在吗</view>
		        <view class="num">1</view>
		      </view>
		    </view>
		  </view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
        jump(){
          uni.navigateTo({
            url: '../ChatRecord/ChatRecord?name=zhao',
            success: res => {},
            fail: () => {},
            complete: () => {}
          });
        }
		}
	}
</script>

<style lang="less">
.search{
  text-align: center;
  width: 710rpx;
  height: 60rpx;
  line-height: 60rpx;
  background-color: #f5f5f5;
  border-radius: 30rpx;
  font-size: 24rpx;
  color: #999999;
  margin: 20rpx;
}
.msglist{
  margin-top: 30rpx;
  .item{
    padding: 0 20rpx;


    .head {
      width: 96rpx;
      height: 96rpx;
      border-radius: 100%;
     flex-shrink: 0;
    }

    .flex {
      width: 100%;
      margin-left: 25rpx;
      justify-content: space-between;
      border-bottom: 1rpx solid #eee;
      padding: 25rpx 0rpx;
      .row{
        justify-content: space-between;
        padding-right: 30rpx;
      }
    }

    .title {
      font-size: 34rpx;
      color: #333333;
    }

    .time {
      font-size: 24rpx;
      color: #97a2b2;
      margin-left: auto;
    }

    .info {
      font-size: 28rpx;
      color: #97a2b2;
    }

    .num {
      width: 40rpx;
      height: 40rpx;
      background-color: #fe313b;
      line-height: 40rpx;
      text-align: center;
      font-size: 24rpx;
      color: #fefefe;
      border-radius: 100%;
      margin-left: auto;
    }
  }
}
</style>
